<template>
    <div>
        <heads></heads>
        <mean></mean>
        <div class="swiper">
            <div class="swiperBg">
                <div class="swiperBox">
                    <div class="swiperImg">
                        <el-carousel height="400px">
                            <el-carousel-item v-for="item, index in imgLists" :key="index">
                                <img :src="item" alt="">
                            </el-carousel-item>
                        </el-carousel>
                    </div>
                </div>
            </div>
        </div>
        <router-view></router-view>
        <footers></footers>
        <sidebar></sidebar>

    </div>
</template>
<script>
// 头部 
import heads from '@/components/header.vue'
// 菜单
import mean from '@/components/mean.vue'
// 侧边栏
import sidebar from '@/components/sidebar.vue'
// 尾部
import footers from '@/components/footer.vue'
export default {
    components: {
        heads,
        mean,
        sidebar,
        footers
    },
    data() {
        return {
            imgList: ['https://b.appsimg.com/upload/momin/2024/11/26/34/1732617058960.jpg'],
            imgLists: ['https://b.appsimg.com/upload/momin/2024/11/26/34/1732617058960.jpg']
        }
    }
}

</script>
<style lang="scss"></style>
<style lang="scss">
.swiper {
    background: url('https://b.appsimg.com/upload/momin/2024/09/14/107/1726308250750.jpg');
    position: absolute;
    width: 1520px;
    top: 231px;
    z-index: 12;

    .swiperBg {
        padding-top: 30px;
        padding-bottom: 20px;
        position: relative;
        height: 392px;
        margin-bottom: 10px;

        .swiperBox {
            .swiperImg {
                padding: 12px;
                background: rgba(255, 255, 255, .86);
                margin: 0 auto;
                box-shadow: 0 1px 3px rgba(167, 167, 167, .4);
                width: 1176px;

                .el-carousel {
                    width: 1146px;
                    margin: 0 auto;
                }
            }
        }
    }
}
</style>
